﻿<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="stylesheet" type="text/css" href="../static/h-ui/css/H-ui.min.css" />
    <link rel="stylesheet" type="text/css" href="../static/h-ui.admin/css/H-ui.admin.css" />
    <link rel="stylesheet" type="text/css" href="../lib/Hui-iconfont/1.0.8/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../static/h-ui.admin/skin/default/skin.css" id="skin" />
    <link rel="stylesheet" type="text/css" href="../static/h-ui.admin/css/style.css" />
    <title>状态</title>
</head>

<body>
    <div class="page-container">
        <div class="cl viewmenutype">
            <input type="button" class="btnstyle "  datastr="images" value="镜像列表" />
            <input type="button" class="btnstyle selected"  datastr="apps" value="容器列表" />
            <input type="button" class="btnstyle "  datastr="stats" value="状态列表" />
        </div>
        <div class="mt-20">
            <table class="table table-border table-bordered table-bg table-hover table-sort table-responsive">
                <thead>
                    <!-- <tr class="text-c">
                        <th width="50">ID</th>
                    </tr> -->
                </thead>
                <tbody>
                    <!-- <tr>
                        <td></td>
                    </tr> -->
                </tbody>
            </table>
        </div>
        <div id="pagenumarea" class="pagenumarea"></div>
    </div>

    <!--_footer 作为公共模版分离出去-->
    <script type="text/javascript" src="../lib/jquery/1.9.1/jquery.min.js"></script>
    <script type="text/javascript" src="../lib/layer/2.4/layer.js"></script>
    <script type="text/javascript" src="../static/h-ui/js/H-ui.min.js"></script>
    <script type="text/javascript" src="../static/h-ui.admin/js/H-ui.admin.js"></script>
    <!--/_footer 作为公共模版分离出去-->
    <!--请在下方写此页面业务相关的脚本-->
    <!-- <script type="text/javascript" src="../lib/My97DatePicker/4.8/WdatePicker.js"></script> -->


    <script src="../lib/api.js"></script>
    <link href="../lib/page.min.css" rel="stylesheet" />
    <script src="../lib/page.min.js"></script>

    <script>

        var pageobject = null;

        var linuxid = 0;

        $(window).ready(function () {

            var idstr = _apigetquery("id");
            if (idstr != null) {
                linuxid = parseInt(idstr);
            }
            _execps();

            $(".viewmenutype").on('click','.btnstyle',function(){
                if(!$(this).hasClass('selected')){
                    var str=$(this).attr('datastr');
                    $(this).siblings().removeClass('selected');
                    $(this).addClass("selected");
                    if(str =="images"){
                        _execimages();
                    }
                    if(str =="stats"){
                        _execstatus();
                    }
                    if(str=="apps"){
                        _execps();
                    }
                }
            })
        });

        function _execstatus() {
            $(".table").find("thead").html("<tr><th>NAME</th><th>MEMORY</th><th>CPU</th><th>PIDS</th><th>NET</th></tr>");
            $(".table").find("tbody").empty();
            _apiget("/api/spider/manage/ExecDockerStats?linuxid=" + linuxid, true, function (code, obj) {
                if (code == 200) {
                    var bodystr = "<tr>";
                    var lines = obj.split('\n');
                    for (var i = 0; i < lines.length; i++) {
                        if (lines[i].length > 0) {
                            var item = JSON.parse(lines[i]);
                            bodystr += "<tr><td>" + item.name + "</td>"
                                + "<td>" + item.memory + "</td>"
                                + "<td>" + item.cpu + "</td>"
                                + "<td>" + item.pids + "</td>"
                                + "<td>" + item.net + "</td>"
                                + "</tr>";
                        }
                    }
                    $(".table").find("tbody").html(bodystr);
                }
            });
        }

        function _execimages() {
            $(".table").find("thead").html("<tr><th>ID</th><th>NAME</th><th>TAG</th><th>SIZE</th><th>CREATE</th><th>操作</th></tr>");
            $(".table").find("tbody").empty();
            _apiget("/api/spider/manage/ExecDockerImages?linuxid=" + linuxid, true, function (code, obj) {
                if (code == 200) {
                    var bodystr = "<tr>";
                    var lines = obj.split('\n');
                    for (var i = 0; i < lines.length; i++) {
                        if (lines[i].length > 0) {
                            var item = JSON.parse(lines[i]);
                            bodystr += "<tr><td>" + item.id + "</td>"
                                + "<td>" + item.name + "</td>"
                                + "<td>" + item.tag + "</td>"
                                + "<td>" + item.size + "</td>"
                                + "<td>" + item.create + "</td>"
                                + '<td><input type="button" class="minbtn" onclick="_actionremoveimage('+linuxid+',\''+item.id+'\');" value="删除"></td>'
                                + "</tr>";
                        }
                    }
                    $(".table").find("tbody").html(bodystr);
                }
            });
        }

        function _execps() {
            $(".table").find("thead").html("<tr><th>ID</th><th>NAME</th><th>IMAGE</th><th>STATUS</th><th>PORT</th><th>操作</th></tr>");
            $(".table").find("tbody").empty();
            _apiget("/api/spider/manage/ExecDockerPs?linuxid=" + linuxid, true, function (code, obj) {
                if (code == 200) {
                    var bodystr = "<tr>";
                    var lines = obj.split('\n');
                    for (var i = 0; i < lines.length; i++) {
                        if (lines[i].length > 0) {
                            var item = JSON.parse(lines[i]);
                            bodystr += "<tr><td>" + item.id + "</td>"
                                + "<td>" + item.name + "</td>"
                                + "<td>" + item.image + "</td>"
                                + "<td>" + item.status + "</td>"
                                + "<td>" + item.port + "</td>"
                                + '<td><input type="button" class="minbtn" onclick="_actionapprestart(\''+item.id+'\');" value="重启"><input type="button" onclick="_actionappstop(\''+item.id+'\');" class="minbtn" value="停止并删除"><input type="button" onclick="_actionappdelete(\''+item.id+'\','+linuxid+');" class="minbtn" value="删除"></td>'
                                + "</tr>";
                        }
                    }
                    $(".table").find("tbody").html(bodystr);
                }
            });
        }

    </script>
</body>

</html>